<template>
  <div>
    <a-modal
      :visible="isShow"
      width="50%"
      ok-text="确认" cancel-text="取消" @cancel="cancelModal"
      :footer="null"
    >
      <div
        style="width: 98%; padding-top: 30px;padding-left: 15px; padding-bottom: 20px"
        id="printContent"
      >
        <h2 style="text-align: center;padding-top: 30px;">{{ obj.data.projectName }}-审批</h2>

        <a-row style="padding-bottom: 10px" class="no-bord">
          <span>编号：{{ obj.data.id }}</span>
          <span style="float: right"></span>
        </a-row>

        <a-row v-for="(i,index) in lable" :key="index">
          <a-col :span="12" class="col" v-for="(c,ix) in i" :key="ix" :class="{'nor': ix %2 !==0 }">
            <div class="title">{{c.label}}</div>
            <div class="val" v-if="c.component.indexOf('JDict') >-1">
              <JDictTag :vals="setVal(c.field)" placeholder="--" :dictCode="c.componentProps.dictCode"/>
            </div>
            <div class="val" v-else>{{ setVal(c.field) }}</div>
          </a-col>
        </a-row>
      </div>
      <div style="text-align: left;margin: 0 15px;padding-bottom: 30px">
        <a-row style="padding-bottom: 10px">审核记录</a-row>
        <!-- 如果已经审核通过了，或者拒绝了不显示 -->
        <!-- <a-card v-if="items.applyStatus !=1 && items.applyStatus !=2"> -->
        <!-- 显示三次的审核意见，结果，时间，审核人 -->
        <!-- <a-card :bordered="false"> -->
          <a-table bordered :dataSource="dataSource" :columns="columns" />
        <!-- </a-card> -->
        <!-- <a-card :bordered="false"> -->
          <a-row style="padding-bottom: 10px;margin-top:12px" v-if="items.applyStatus !=1 && items.applyStatus !=2">审核</a-row>
          <a-radio-group v-model:value="updata.applyStatus" name="radioGroup" v-if="items.applyStatus !=1 && items.applyStatus !=2">
            <a-radio value="1">通过</a-radio>
            <a-radio value="2">拒绝</a-radio>
          </a-radio-group>
          <a-textarea v-model:value="updata.applyContent" placeholder="请输入说您的审核意见" allow-clear style="margin-top:12px" />
          <a-button type="primary" style="margin-top:20px" @click="proApply">提交审核</a-button>
        <!-- </a-card> -->
      </div>
    </a-modal>
  </div>
</template>

<script setup>
import { ref, reactive, computed, onMounted } from "vue"
import { JDictTag } from '/@/components/Form'
import { getProApplyInfo, proApply, getRcLog } from '../MonsterRocProjectSetup.api'
import { formSchema } from '../MonsterProjectCost.data'
import { USER_INFO_KEY } from '/@/enums/cacheEnum'
import { getAuthCache } from '/@/utils/auth'
let user = getAuthCache(USER_INFO_KEY) || {}
let props = defineProps({
  isShow: false,
  ids: '',
  items: ''
})
const emit = defineEmits(['handleCallFun'])
const lable = ref([])
const obj = reactive({
  data: {}
})

const updata = ref({
  projectId: props.items.id,
  projectName: props.items.name,
  applyProjectType: 2,
  applyStatus: "1",
  applyer: user.id,
  applyContent: '',
  sendApplyTime: ''
})

const dataSource = ref([
  {
    applyTime: '2023-12-21',
    applyUserId: '',
    dataIndex: 32,
    applyContent: '',
}])

const columns = ref([
  {
    title: '时间',
    dataIndex: 'applyTime',
    key: 'applyTime',
  },
  {
    title: '结果',
    dataIndex: 'applyStatus',
    key: 'applyStatus',
  },
  {
    title: '审核意见',
    dataIndex: 'applyContent',
    key: 'applyContent',
  },
  {
    title: '审核人',
    dataIndex: 'applyUserName',
    key: 'applyUserName',
  }
])

const cancelModal = () => {
  emit('handleCallFun')
}

function setVal(field) {
  for(let o in obj.data) {
    if(o == field && field && field !='pm') {
      return obj.data[o] || '-'
    }
    if(field =='pm') {
      return obj.data['createBy'] || '-'
    }
  }
}

async function rocDetail () {//'1353563050407936002'
  let r = await getProApplyInfo({id: props.items.id})
  obj.data = r
  const result = []
  for (let i = 0; i < formSchema.length; i += 2) {
    result.push(formSchema.slice(i, i + 2))
  }
  lable.value = result

  let l = await getRcLog({ projectId: props.items.id})
  dataSource.value = l
}

function proApplyFun () {
  updata.sendApplyTime = new Date()
  proApply(updata.value).then((res) => {
    emit('handleCallFun', true)
  })
}

onMounted(() => {
  console.log(props.items)
  rocDetail()
})
</script>
<style scoped lang="less">
/deep/ .el-dialog__footer {
  height: 70px;
  margin-top: 15px;
}

.col {
  // border: 1px solid #e6e9f0;
  border: 1px solid #666;
  border-top: 0;
  height: 55px;
  display: flex;
  align-items: center;

  div {
    padding-left: 20px;
  }
  .title {
    // min-width: 150px;
    min-width: 105px;
    // background-color: #f5f5f5; //title的背景色
    // color: #1F2E4D;
    color: #666;
  }
  .val {
    flex: 1;
    // border-left: 1px solid #e6e9f0;
    border-left: 1px solid #666;
    // color: #3D4966;
    color: #666;
    height: 55px;
  }
}
.nor{
  border-left: 0;
}
.no-bord{
  border-bottom: 1px solid #666;
}
</style>
